<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    
  </style>
</head>
<body>
  <div class="box" abc="hello">
    <span>1</span>
    hello
    <!-- 注释 -->
    <!-- 还是注释 -->
  </div>
</body>
<script>

  var box = document.querySelector(".box")
  var child = box.childNodes;
  var attrs = box.attributes;

  console.log( child[1] );
  console.log( child[1].nodeType );
  console.log( child[1].nodeName );
  console.log( child[1].nodeValue );

  console.log( child[2] );
  console.log( child[2].nodeType );
  console.log( child[2].nodeName );
  console.log( child[2].nodeValue );
  
  console.log( child[3] );
  console.log( child[3].nodeType );
  console.log( child[3].nodeName );
  console.log( child[3].nodeValue );

  console.log( attrs[1] );
  console.log( attrs[1].nodeType );
  console.log( attrs[1].nodeName );
  console.log( attrs[1].nodeValue );

  console.log( document );
  console.log( document.nodeType );
  console.log( document.nodeName );
  console.log( document.nodeValue );

  // 过滤
  for(var i=0;i<child.length;i++){
    if(child[i].nodeType === 8){
      console.log(child[i]);
    }
  }

  // 节点的数据类型：object
  // 节点类型：需要通过nodeType检测

</script>
</html>